/*
 * @Description: 散文件与档案类型列表
 * @Author: Zzt
 * @Date: 2022-11-03 14:24:13
 * @LastEditTime: 2022-12-30 11:08:50
 */

import { Button, Space, Table } from 'antd';
import Column from 'antd/es/table/Column';
import { useEffect, useMemo, useState } from 'react';
import { useMappingRelationContext } from '../contexts/MappingRelationContext';
import EditFAT from './dialogs/FAT/EditFAT';

const FATList = (props: any) => {
  const { type } = props;
  const { setSelectKey, selectItems, getFATList, delFAT, FATList, TAFList } =
    useMappingRelationContext();

  const [total, setTotal] = useState(0);
  const [loading, setLoading] = useState(false);
  const [data, setData] = useState();
  const [editFATVisible, setEditFATVisible] = useState(false);
  const [listQuery, setListQuery] = useState({
    pageNo: 1,
    pageSize: 10,
    param: {}
  });
  /**
   * @description 切换页码触发
   * @param {number} page 页码
   * @param {number} pageSize 每页条目数
   */
  const pageChange = (page: number, pageSize: number) => {
    setListQuery((state) => ({
      ...state,
      pageNo: page,
      pageSize
    }));
  };
  /* 切换页码查找列表 */
  useEffect(() => {
    if (listQuery) {
      // setLoading(true);

      getFATList(listQuery);
      // .then((res: any) => {
      //   setTotal(res?.totalCount);
      //   setTimeout(() => {}, 2000);
      // })
      // .finally(() => {
      //   setLoading(false);
      // });
    }
  }, [listQuery]);
  /**
   * @description : 表格选项相关设置
   * @param {number} selectedRowKeys 选择的项目的KEY
   */
  const onSelectChange = (selectedRowKeys: number[]) => {
    setSelectKey(selectedRowKeys);
  };
  /**
   * @description:  表格多选配置
   */
  const rowSelection = {
    selectItems,
    onChange: onSelectChange
  };
  /* 修改内容 */
  const onEdit = (record: any) => {
    setData(record);
    setEditFATVisible(true);
  };
  return (
    <>
      <Table
        dataSource={type === 1 ? FATList : TAFList}
        loading={loading}
        rowKey="id"
        size="small"
        scroll={{ x: 'max-content' }}
        bordered
        rowSelection={rowSelection}
        pagination={{
          current: listQuery.pageNo,
          pageSize: listQuery.pageSize,
          total,
          onChange: pageChange
        }}
      >
        <Column title="序号" dataIndex="id" key="id" align="center" />
        <Column title="全宗" dataIndex="description" key="description" align="center" />
        <Column title="档案类型" dataIndex="type" key="type" align="center" />
        <Column title="建立时间" dataIndex="creatTime" key="creatTime" align="center" />
        <Column title="创建人" dataIndex="buildMen" key="buildMen" align="center" />
        <Column title="修改人" dataIndex="changeMen" key="changeMen" align="center" />
        <Column title="备注" dataIndex="remark" key="remark" align="center" />
        <Column
          title="操作"
          key="action"
          align="center"
          render={(_text, record: any) => (
            <Space>
              <Button type="link" size="small" onClick={() => onEdit(record)}>
                修改
              </Button>
              <Button type="link" size="small" onClick={() => delFAT(record.id)}>
                删除
              </Button>
            </Space>
          )}
        />
      </Table>
      {useMemo(
        () => (
          <EditFAT
            data={data}
            visible={editFATVisible}
            onClose={() => {
              setEditFATVisible(false);
            }}
            type={type}
          />
        ),
        [editFATVisible]
      )}
    </>
  );
};
export default FATList;
